<template>
	<view class="progress">
		<view class="conent">
			<progress active=true :duration="1" stroke-width="10" border-radius="5" :percent="value" :activeColor="color" :backgroundColor="backcolor"></progress>
		</view>
		<view :style="{'color':color}" class="sign">{{value}}%</view>
	</view>
</template>

<script>
	export default {
		props:['value','color','backcolor'],
	}
</script>

<style lang="scss" scoped>
.progress{
	width: 100%;
	display: flex;
	align-items: center;
	height: 20px;
	.tabr{
		height: 20px;
	}
}
.conent{
	width: 80%;
}
.sign{
	width: 20%;
	font-size:13px;
	text-align: center;
	font-family:DIN;
	font-weight:bold;
	color:rgba(255,78,94,1);
}
</style>
